<!--过滤查询-->
<nz-row>
  <div class="searchItem">
    <label for="templateName">模版名称</label>
    <input
      id="templateName"
      nz-input
      placeholder="请输入模版名称"
      [(ngModel)]="query.templateName"
    />
  </div>
  <div class="searchItem">
    <label for="templateRemark">模版备注</label>
    <input
      id="templateRemark"
      nz-input
      placeholder="请输入模版备注"
      [(ngModel)]="query.templateRemark"
    />
  </div>
  <div class="searchItem">
    <label for="date">更新时间</label>
    <nz-range-picker id="date" nzFormat="yyyy-MM-dd" [(ngModel)]="query.date"></nz-range-picker>
  </div>
  <div class="searchItem">
    <button nz-button nzType="primary" (click)="queryBtn()">查询</button>
    <button nz-button nzType="default" (click)="resetCondition()">重置</button>
    <button nz-button nzType="primary" (click)="gotoPage()">新增模版</button>
    <button nz-button nzType="primary" [nzLoading]="refreshLoading" [disabled]="refreshLoading" (click)="refresh()">刷新</button>
  </div>
</nz-row>
<!--表格-->
<nz-table
  #rowSelectionTable
  nzSize="small"
  nzTableLayout="fixed"
  nzShowSizeChanger
  nzShowQuickJumper
  nzOuterBordered
  [nzData]="listOfData.records"
  [nzPageSizeOptions]="[5, 10, 20, 50, 100]"
  [nzTotal]="listOfData.total"
  [(nzPageIndex)]="query.page"
  [(nzPageSize)]="query.pageSize"
  [nzFrontPagination]="false"
  [nzShowTotal]="totalTemplate"
  (nzPageIndexChange)="onPageIndexChange($event)"
  (nzPageSizeChange)="onPageSizeChange($event)"
>
  <thead>
  <tr>
    <th nzAlign="center" [nzWidth]="'100px'">ID</th>
    <th nzAlign="center">模版标题</th>
    <th nzAlign="center">模版备注</th>
    <th nzAlign="center">引用</th>
    <th nzAlign="center">更新时间</th>
    <th nzAlign="center" nzWidth="250px">操作</th>
  </tr>
  </thead>
  <tbody>
  <tr *ngFor="let data of rowSelectionTable.data;let index=index;">
    <td nzAlign="center">{{ data['id'] }}</td>
    <td nzAlign="center" style="white-space: pre">{{ data['title'] }}</td>
    <td nzAlign="center" nzEllipsis [nzTooltipTitle]="data['remarks']" nzTooltipPlacement="top" nz-tooltip>
      {{ data['remarks'] }}</td>
    <td nzAlign="center" [ngStyle]="{color: data['modelNum']>0?'#1890ff':''}" (click)="toAssessType(data)">{{ data['modelNum'] }}</td>
    <td nzAlign="center">{{ data['updateTime'] }}</td>
    <td nzAlign="center" style="display: flex;flex-direction: row;justify-content: space-between">
      <a (click)="viewTemplate(data)">查看</a>
      <a (click)="preview(data['context'])">预览</a>
      <a (click)="copy(data)">复制</a>
      <a (click)="modify(data)">编辑</a>
      <a style="color: #F56C6C"
         nzPopconfirmPlacement="top"
         nz-popconfirm
         nzPopconfirmTitle="确认要删除该数据吗?"
         nzOkText="确认"
         nzCancelText="取消"
         (nzOnConfirm)="deleteRow(data['id'])">删除</a>
    </td>
  </tr>
  </tbody>
</nz-table>
<!-- 分页template -->
<ng-template #totalTemplate let-total>共有 {{ listOfData.total }} 条</ng-template>


<app-preview-assess-price-template *ngIf="previewAssessPriceVisible" [visible]="previewAssessPriceVisible"
                                   (visibleChange)="previewAssessPriceVisible=!previewAssessPriceVisible"
                                   [questionList]="questionList"></app-preview-assess-price-template>
